<template>
  <div class="app-container">
    <el-form ref="form" :model="shopInfo" label-width="80px">

      <el-form-item label="店铺头像">
        <img class="logo" :src="shopInfo.shopLogo">
      </el-form-item>
      <div class="box">
        <el-form-item label="店铺名称">
          <el-input v-model="shopInfo.shopName"/>
        </el-form-item>
        <el-form-item label="工作时间">
          <el-input style="width: 200px" v-model="shopInfo.workTime"/>
        </el-form-item>
        <el-form-item label="联系电话">
          <el-input style="width: 200px" v-model="shopInfo.phone"/>
        </el-form-item>
      </div>
      <el-form-item label="地址">
        <el-input disabled style="width: 100px" v-model="shopInfo.province"/>
        <span> - </span>
        <el-input disabled style="width: 100px" v-model="shopInfo.city"/>
        <span> - </span>
        <el-input disabled style="width: 100px" v-model="shopInfo.district"/>
        <span> - </span>

        <el-input disabled style="width: 300px" v-model="shopInfo.address"/>
      </el-form-item>
      <el-form-item label="状态">
        <el-tag v-if="shopInfo.status==='1'" type="success">正常</el-tag>
        <el-tag v-if="shopInfo.status==='-1'" type="danger">禁用</el-tag>
      </el-form-item>

      <el-form-item label="商家标签">
        <el-tag class="mr-1" type="danger" v-for="(item1,index1) in shopInfo.shopLabelDto" :key="index1">{{ item1 }}
        </el-tag>

      </el-form-item>
      <el-form-item label="服务标签">
        <el-tag class="mr-1" type="danger" v-for="(item2,index2) in shopInfo.serviceDto" :key="index2">{{ item2 }}
        </el-tag>


      </el-form-item>
      <el-form-item label="优质服务">
        <el-tag class="mr-1" type="danger" v-for="(item3,index3) in shopInfo.superiorServiceDto" :key="index3">
          {{ item3 }}
        </el-tag>

      </el-form-item>

      <el-form-item>
        <el-button type="primary" style="float: right" @click="updateShopInfo">保存</el-button>
      </el-form-item>
    </el-form>

  </div>

</template>

<script>
import { getShopInfo, updateShopInfo } from '@/api/shop'

export default {
  name: 'shopInfo',
  data() {
    return {
      shopInfo: {}
    }
  },
  created() {
    this.getShopInfo()
  },
  methods: {
    getShopInfo() {
      getShopInfo({}).then(res => {
        this.shopInfo = res.dataMap
        console.log(res.dataMap)

      })
    },
    updateShopInfo() {
      updateShopInfo(this.shopInfo).then(res => {
        if (res.success) {
          this.$message({
            message: '修改成功',
            type: 'success'
          })
        }

      })
    }
  }

}
</script>

<style scoped>
.logo {
  width: 100px;
  height: 100px;
}

</style>
